<template lang="jade">
#account-other
  .personal-data
    form
      .form-item.weui-flex
        label 读者证号
        .weui-flex__item.readonly {{ user.rdid }}
      .form-item.weui-flex
        label 状态
        .weui-flex__item.readonly {{ statusLabel(user.status) }}
      .form-item.weui-flex
        label 联系电话
        input.weui-flex__item(type='telephone', v-model='phone')
      .form-item.weui-flex
        label 住址
        input.weui-flex__item(type='text', v-model='address')
      .form-action.weui-flex
        button.btn-blue.weui-btn.weui-btn_primary(@click.prevent.stop='update') 更新
        //- button.btn-blue.weui-btn.weui-btn_mini.weui-btn_plain-default 重置
</template>

<script>
import { mapGetters, mapActions } from 'vuex'
import api from '../../../api-new'
export default {
  name: 'account-basic',
  data () {
    return {
      phone: '',
      address: ''
    }
  },
  computed: {
    ...mapGetters({
      'user': 'userInfo'
    })
  },
  mounted () {
    this.phone = this.user.phone
    this.address = this.user.address
  },
  methods: {
    statusLabel (status) {
      switch (status) {
        case 'NORMAL':
          return '正常'
        case 'LOST':
          return '挂失'
        case 'OVERDUE':
          return '过期'
        default:
          return status
      }
    },
    update () {
      const patronId = this.$cookie.get('uid')
      api.userUpdate({
        patronId,
        address: this.address,
        phone: this.phone
      })
      .then(({data}) => {
        window.alert('更新成功')
      })
    },
    ...mapActions(['getUserInfo'])
  }
}
</script>
